<template>

  <div id="admin">
    <a-layout>
      <a-layout-sider>
        <div class="admin-logo">
          <a href="/">logo</a>
        </div>
        <a-menu mode="inline" style="width: 200px" :default-selected-keys="['0']">
          <a-menu-item :key="index" v-for="(item,index) in navs">
            <nuxt-link :to="item.link">
              {{item.name}}
            </nuxt-link>
          </a-menu-item>ffrereeaqffiikujy
        </a-menu>
      </a-layout-sider>
      <a-layout>
        <a-layout-header>Header</a-layout-header>
        <a-layout-content>
          <nuxt class="admin_main" />
        </a-layout-content>
        <a-layout-footer>Footer</a-layout-footer>
      </a-layout>
    </a-layout>
  </div>
</template>

<script lang="ts">
import { Component, Prop, Vue, Emit } from "vue-property-decorator";
@Component({
  middleware: "auth",
  head() {
    return {
      title: "工作台",
      titleTemplate: "%s - by 刘洋博客",
    };
  },
})
export default class extends Vue {
  form: Object = {};
  navs: Array<any> = [
    { name: "首页", link: "/admin" },
    { name: "发布", link: "/admin/add" },
    { name: "文章管理", link: "/admin/article" },
    { name: "导航管理", link: "/admin/nav" },
    { name: "评论管理", link: "/admin/commont" },
  ];
  created() {}

  handleSubmit() {}
}
</script>

<style lang="scss" scoped>
.ant-layout {
  height: 100vh;
}
.ant-layout-sider {
  background-color: #fff;
}
.ant-layout-content {
  padding: 20px;
}
.admin-logo {
  height: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
}

// 数据列表 搜索条件
::v-deep .table-search-wrapper {
  .ant-form-inline {
    .ant-form-item {
      display: flex;
      margin-bottom: 24px;
      margin-right: 0;

      .ant-form-item-control-wrapper {
        flex: 1 1;
        display: inline-block;
        vertical-align: middle;
      }

      > .ant-form-item-label {
        line-height: 32px;
        padding-right: 8px;
        width: auto;
      }
      .ant-form-item-control {
        height: 32px;
        line-height: 32px;
      }
    }
  }

  .table-page-search-submitButtons {
    display: block;
    margin-bottom: 24px;
    white-space: nowrap;
  }
}
// 数据列表 操作
::v-deep .table-operator {
  margin-bottom: 18px;
  button {
    margin-right: 8px;
  }
}
</style>

